import { createSlice, PayloadAction } from '@reduxjs/toolkit';

const namespace = 'screen';

export interface GlobalState {
  /**
   * 设备类型
   * mobile 手机
   * table 平板
   * pc  电脑
   */
  screen: 'mobile' | 'table' | 'pc';
  /**
   * 建议列数
   */
  column: number;
}

const initialState: GlobalState = {
  screen: 'pc',
  column: 4,
};
const globalSlice = createSlice({
  name: namespace,
  initialState,
  reducers: {
    setScreen: (state, action: PayloadAction<GlobalState>) => {
      const { screen, column } = action.payload;
      if (screen != state.screen) {
        state.screen = screen;
      }
      if (column != state.column) {
        state.column = column;
      }
    },
  },
  extraReducers: () => {},
});

export const { setScreen } = globalSlice.actions;

export default globalSlice.reducer;
